<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Document</title>
    <script type="text/javascript" src="../js/vue.runtime.js"></script>
  </head>
  <body>
    <!-- 
    关于不同版本的vue
    1.vue.js与vue.runtime....js的区别
        (1)vue.js是完整版的vue，核心功能+模板解析器
        (2)vue.runtime....js是运行版的vue，只有核心功能，没有模板解析器
    2.因为vue.runtime....js没有模板解析器，所以不能使用template配置项，只能使用render()函数接收到的createElement()函数制定渲染的内容
    -->

    <!-- 
    使用 runtime 版的 vue ，报的错跟不使用render()一模一样
    [Vue warn]: You are using the runtime-only build of Vue where the template compiler is not available.
    Either pre-compile the templates into render functions, or use the compiler-included build.
    
    此文件把render()函数拿出来用就可以正常了，写了它就不需要 template 配置了
    -->
    <div id="root">
      <h1>{{msg}}</h1>
    </div>
    <script type="text/javascript">
      Vue.config.productionTip = false;
      const vm = new Vue({
        data: {
          msg: "你好啊",
        },
        /* render(createElement) {
          return createElement("h1", "你好啊");
        }, */
      });
      vm.$mount("#root");
    </script>
  </body>
</html>
